<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>SSD微信公众号-图集</title>
    <% include  public/head%>
    <link rel="stylesheet" type="text/css" href="./../public/front/style/pic.css">
    <!-- Demo styles -->
</head>

<body>
<div class="container-fluid">
    <div class="content">
        <h3> <a href="./data_picCate" class=" back">图集</a></h3>
        <div class="mgtop">
            <% if(picItems.length<=0){%>
                <div class="noData">该分类下没有数据</div>
            <%}%>
            <section class="section">
                <ul>

                    <% picItems.forEach(function(pic){  %>
                    <li>


                        <div class="categroy arrowopen">
                            <div class="pic center"><img src="\<%= pic.pic%>"></div>
                            <div class="text"><%= pic.seriesName%>
                                <p>如需高清图片请联系公众号</p>
                            </div>

                        </div>

                        <div class="wrapper clear">
                            <ul class="wall">
                                <%
                                    if(typeof (pic.Url)!==typeof (undefined)){

                                       JSON.parse(pic.Url) .forEach(function(x){%>
                                            <li class="article">
                                                <img src="../<%= x.picPath %>" />

                                            </li>
                                        <%})
                                    }else{%>
                                          <div class="noData">没有数据</div>
                                        <%}

                                %>



                            </ul>
                        </div>
                        <!--/.wrapper 750 Series-->
                    </li>
                    <% })%>


                </ul>
            </section>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(function() {


        $(".section li .categroy").each(function() {
            var $wall = $(this).parent().find('.wall');
            $(this).click(function(event) {
                if ($(this).hasClass('arrowopen')) {
                    //处于关闭状态，打开
                    $(this).removeClass('arrowopen').addClass('arrowclose').css("border-bottom", "3px solid #F4F3DE");
                    $($wall).css("display", "block").addClass('open');

                } else {
                    $(this).removeClass('arrowclose').addClass('arrowopen').removeAttr('style');
                    $($wall).css("display", "none").removeClass('open');
                }

            });
        });


    });
</script>
</body>
